<template>
  <div class="wrap">
    <Form :model="userInfo" :label-width="80"
      >
      <FormItem label="头像:">
        <img width="50px" height="50px" :src="userInfo.avatar" alt="">
        <upload class="upload" @uploadSuccess="handleSuccess"></upload>
        <Input
          v-model="userInfo.avatar"
          placeholder="Enter something..."
        ></Input>
      </FormItem>
      <FormItem label="账号:">
        <Input
          v-model="userInfo.account"
          placeholder="Enter something..."
        ></Input>
      </FormItem>
      <FormItem label="用户名:">
        <Input
          v-model="userInfo.username"
          placeholder="Enter something..."
        ></Input>
      </FormItem>
      <FormItem label="医院:" v-if="isDoctor">
        <Input
          v-model="userInfo.hospital"
          placeholder="Enter something..."
        ></Input>
      </FormItem>
      <FormItem label="个人简介:">
        <Input
        type="textarea"
          v-model="userInfo.introduction"
          placeholder="Enter something..."
        ></Input>
      </FormItem>
    </Form>
    <div class="btn">
      <Button type="primary" @click="handle()">保存</Button>
    </div>
  </div>
</template>

<script>
import { getSession,setSession } from "@/utils";
import upload from "@/components/upload/upload.vue";

export default {
  components:{
    upload
  },
  data() {
    return {
      userInfo: {},
      isDoctor:false
    };
  },
  created() {
    let isDoctor = getSession('isDoctor');
    let userInfo = getSession("userInfo");
    this.isDoctor = isDoctor;
    this.userInfo = userInfo;
  },
  methods:{
    handle(){
      this.HttpService.updUserInfo(this.userInfo).then(res => {
        console.log(res);
        if (res.code === 0) {
          this.$Message.success(res.message);
          setSession("userInfo", this.userInfo);
        }
      })
    },
    // upload
    handleSuccess(msg){
      console.log(msg)
      if(msg.code == 0){
        // 立即设置会报404,可能还没获取到资源,因此延迟1s加载
        setTimeout(() =>{
          let url = 'https://localhost:3333' + msg.finalPath + '.jpg'
          this.userInfo.avatar = url
        },1000)
      }
    },
    handleBeforeUpload(){

    }
  }
};
</script>

<style lang='less' scoped>
.wrap {
  margin-top: 20px;
  padding-right: 50px;
  .btn{
    text-align: center;
  }
}
</style>
